<template>
  <div id="main">
    <div class="left">
      <edit-tree-new
        ref="tree"
        :treeSetting="treeSetting"
        :hideBtn="hideBtn"
        :hideInp="hideInp"
        @handleClickTree="handleClickTree"
      />
    </div>
    <div class="right">
      <detail-page
        ref="detail"
        :id="treeNodeId"
        @save="save"
        @deleteOnce="deleteOnce"
      />
    </div>
  </div>
</template>

<script>
import detailPage from "./detailPage.vue";
import { baseParamList } from "@/api/standardManagement/acountManagement.js";
export default {
  name: "baseParameter",
  components: {
    detailPage,
  },
  data() {
    return {
      treeSetting: {
        btnArr: ["add"],
        title: "基本参数组",
        data: [],
        defaultProps: {
          children: "children",
          label: "name",
        },
      },
      hideInp: false,
      hideBtn: true,
      treeNode: null,
      treeNodeId: "",
      orgCode: "",
    };
  },
  created() {
    this.getTableList();
  },
  methods: {
    //点击树节点
    handleClickTree(node) {
      this.treeNode = node;
      this.treeNodeId = node.id;
    },
    //获取基本参数列表
    getTableList() {
      baseParamList()
        .then((res) => {
          if (res.code == 200) {
            this.orgCode = this.treeNode ? this.treeNode : res.data[0];
            this.$refs.tree.setTreeData(res.data);
            this.$refs.tree.setCurrentKey(this.orgCode);
          }
        })
        .catch((res) => {
          this.$message.error(res.description);
          return;
        });
    },
    //保存后刷新列表
    save() {
      this.getTableList();
      this.$refs.detail.getParamTable(this.id);
    },
    deleteOnce() {
      this.id = "";
      this.getTableList();
    },
  },
};
</script>

<style lang="less" scoped>
#main {
  width: 100%;
  height: 100%;
  display: flex;
  //border-top: 10px solid #eaf4ff;
  .left {
    height: 100%;
    width: 300px;
  }
  .right {
    width: calc(100% - 250px);
    height: 100%;
    border-left: 10px solid #EAF4FF;
    padding: 20px;
    overflow: auto;
    flex: 1;
  }
  .active {
    background-color: #e8f1f8;
  }
}
</style>